<!DOCTYPE html>
<html lang="zh">
<head>
    <meta charset="UTF-8">
    <title>登录界面</title>
    <script src="{{ url_for('static', filename='common/jquery-3.6.0.min.js') }}"></script>
    <link rel="stylesheet" type="text/css"
          href="{{ url_for('static', filename='common/bootstrap/bootstrap.min.css') }}">
    <script src="{{ url_for('static', filename='common/bootstrap/bootstrap.min.js') }}"></script>
    <script>
        $(document).ready(function () {
            //登录验证
            $('#btn1').click(function () {
                let username = $('#username').val().trim()
                let password = $('#password').val().trim()
                let user_type = $('#user_type:checked').val()
                let time = $('#time:checked').prop('checked')
                if (time === true) {
                    var type1 = 'month'
                } else {
                    var type1 = 'day'
                }
                $.ajax({
                    url: '{{ url_for("login.login1") }}',
                    type: 'post',
                    data: {'username': username, 'password': password, 'identity':user_type, 'type1': type1},
                    success: function (data) {
                        if (data === 'true') {
                            alert('验证成功！您好' + username)
                            window.open('{{ url_for("make.make_index") }}', '_self')
                        } else {
                            alert('用户名，密码或身份选择错误')
                        }
                    },
                    error: function () {
                        alert('程序错误，请联系管理员')
                    }
                })
            })

            //管理员界面登录验证
            $('#btn2').click(function () {
                var username_master = $('#username_master').val().trim()
                var password_master = $('#password_master').val().trim()
                $.ajax({
                    url: '{{ url_for("login.login_master") }}',
                    type: 'post',
                    data: {'username_master': username_master, 'password_master': password_master, 'identity_master':'管理员'},
                    success: function (data) {
                        if (data === 'true') {
                            alert('验证成功！您好' + username_master)
                            window.open('{{ url_for("login.login2") }}', '_self')
                        } else {
                            alert('用户名或密码错误')
                        }
                    },
                    error: function () {
                        alert('程序出现错误，请联系管理员')
                    }
                })
            })

            $('#myTab a').on('click', function (event) {
                event.preventDefault()
                $(this).tab('show')
            })
        })
    </script>
    <style>
        * {
            margin: 0;
            padding: 0;
        }

        /*网页背景*/
        {#body {#}
        {#    background-image: url(../../static/common/img/bg.jpg);#}
        {#    background-repeat: no-repeat;#}
        {#    background-attachment: fixed;#}
        {#    background-size: 100%;#}

        body {
            background-image: url(../../static/common/img/bg2.jpg);
            background-repeat: no-repeat;
        {#background-attachment: fixed;#} background-size: 100%;
        }

        .box {
            border-top: 1px #f8f9fe solid;
            background-color: #f8f9fe;
            border-radius: 30px;
            margin: 50px auto 0;

            width: 400px;
            padding: 30px;
            box-shadow: 0 0 10px 10px lightgrey;
            font-size: small;
        }

        h3 {
            text-align: center;
        }

        table {
            margin: 0 auto;
        }

        button {
            width: 70%
        }

        .logo {
            position: fixed;
            top: 0;
            right: 0;
            width: 270px;
            height: 320px;
        {#background-color: #0a58ca;#}
        }

        .logo img {
            width: 100%;
        }

        .logo div {
            width: 100%;
            height: 100%;
            text-align: center;
            font-size: xxx-large;
            font-weight: bolder;
            color: red;
        }
    </style>
</head>
<body>
<!--右上角标志-->
<div class="logo">
    <img src="{{ url_for('static', filename='common/img/logo.png') }}" alt="公司标志">
    <div>中&nbsp;&nbsp;&nbsp;通</div>

</div>

<div class="box">
    <h3>中通仓库管理系统</h3>
    <br>
    <ul class="nav nav-tabs" id="myTab" role="tablist">
        <li class="nav-item" role="presentation">
            <a class="nav-link active" id="home-tab" data-toggle="tab" href="#home" role="tab" aria-controls="home"
               aria-selected="true">用户登录</a>
        </li>
        <li class="nav-item" role="presentation">
            <a class="nav-link" id="profile-tab" data-toggle="tab" href="#profile" role="tab" aria-controls="profile"
               aria-selected="false">管理员登录</a>
        </li>
    </ul>
    <div class="tab-content" id="myTabContent">
        <div class="tab-pane fade show active" id="home" role="tabpanel" aria-labelledby="home-tab">
            <br>
            <div class="input-group mb-3">
                <div class="input-group-prepend">
                    <span class="input-group-text" id="inputGroup-sizing-default">账户</span>
                </div>
                <input type="text" class="form-control" aria-label="Sizing example input"
                       aria-describedby="inputGroup-sizing-default" id="username" autocomplete="new-complete">
            </div>
            <div class="input-group mb-3">
                <div class="input-group-prepend">
                    <span class="input-group-text" id="inputGroup-sizing-default">密码</span>
                </div>
                <input type="text" class="form-control" aria-label="Sizing example input"
                       aria-describedby="inputGroup-sizing-default" id="password" autocomplete="new-complete">
            </div>
            <label for="user_type">用户</label><input id="user_type" type="radio" checked="checked" name="cmy" value="用户"/>
            <label for="user_type">访客</label><input id="user_type" type="radio" name="cmy" value="只读"/>
            <label for="time">是否在30天内保持登录状态：</label><input type="checkbox" checked="checked" id="time"
                                                           value="month"/>
            <div style="margin-top: 20px">
                <button type="button" class="btn btn-outline-dark" id="btn1" style="width: 100%">提交</button>
            </div>
        </div>
        <div class="tab-pane fade" id="profile" role="tabpanel" aria-labelledby="profile-tab">
            <br>
            <div class="input-group mb-3">
                <div class="input-group-prepend">
                    <span class="input-group-text" id="inputGroup-sizing-default">账户</span>
                </div>
                <input type="text" class="form-control" aria-label="Sizing example input"
                       aria-describedby="inputGroup-sizing-default" id="username_master" autocomplete="new-complete">
            </div>
            <div class="input-group mb-3">
                <div class="input-group-prepend">
                    <span class="input-group-text" id="inputGroup-sizing-default">密码</span>
                </div>
                <input type="text" class="form-control" aria-label="Sizing example input"
                       aria-describedby="inputGroup-sizing-default" id="password_master" autocomplete="new-complete">
            </div>
            <div style="margin-top: 20px">
                <button type="button" class="btn btn-outline-dark" id="btn2" style="width: 100%">提交</button>
            </div>
        </div>
    </div>
</div>

</body>
</html>